import { _decorator, Animation, Button, Component, Node, tween, UIOpacity, Vec3 } from 'cc';
import Utils from '../utils/Utils';
import super_html_playable from '../core/super_html_playable';
import { AudioManager } from '../game/AudioManager';
const { ccclass, property } = _decorator;

@ccclass('UIEnd')
export class UIEnd extends Component {
    @property(Node) download: Node = null;
    @property(Button) btnShare: Button = null;
    @property(Node) title: Node = null!
    @property(Node) panel: Node = null!
    @property(Node) downloadNode: Node = null!
    @property(Node) SSR: Node = null!;

    @property(Node) circle: Node = null!;
    @property(Node) light: Node = null!;
    @property(Node) light2: Node = null!;

    start() {
        AudioManager.Instance.playWin();
        Utils.AutoScale(this.download);
 
        // this.btnShare.node.on(Button.EventType.CLICK, () => {
        //     super_html_playable.game_end();
        //     super_html_playable.download();
        // }, this);

        tween(this.node)
            .call(() => { this.playAnim(this.title); })
            .delay(0.08)
            .call(() => { this.playAnim(this.panel); })
            .delay(0.08)
            .call(() => { this.playAnim(this.downloadNode); })
            .delay(0.08)
            .start();

        const op = this.circle.getComponent(UIOpacity);
        tween(op)
            .to(0.5, { opacity: 255 })
            .to(0.5, { opacity: 0 })
            .union()
            .repeatForever()
            .start();

        // light 顺时针旋转，light2 逆时针旋转，确保不间断
        this.light.angle = 0;
        this.light2.angle = 0;
        tween(this.light)
            .by(20, { angle: 360 })
            .repeatForever()
            .start();
        tween(this.light2)
            .by(30, { angle: -360 })
            .repeatForever()
            .start();

        // this.scheduleOnce(() => {

        //     // 先全部隐藏并重置透明度
        //     for (let i = 0; i < this.SSR.children.length; i++) {
        //         const node = this.SSR.children[i];
        //         let op = node.getComponent(UIOpacity);
        //         op.opacity = 0;
        //     }

        //     // 递归依次渐显
        //     const showSSRStep = (i: number) => {
        //         if (i >= this.SSR.children.length) return;
        //         const node = this.SSR.children[i];
        //         const op = node.getComponent(UIOpacity);
        //         if (op) {
        //             tween(op)
        //                 .to(0.18, { opacity: 255 })
        //                 .call(() => {
        //                     setTimeout(() => showSSRStep(i + 1), 120);
        //                 })
        //                 .start();
        //         } else {
        //             setTimeout(() => showSSRStep(i + 1), 120);
        //         }
        //     };
        //     showSSRStep(0);
        // }, 1)

    }

    // 缩放值从 0 快速放大 1.3 再缩小到 0.9 然后反弹到 1.05 最后回弹到 1
    private playAnim(target: Node) {
        target.active = true
        tween(target)
            .to(0.1, { scale: new Vec3(1.15, 1.15, 1) })
            .to(0.1, { scale: new Vec3(0.95, 0.95, 1) })
            .to(0.15, { scale: new Vec3(1.1, 1.1, 1) })
            .to(0.15, { scale: new Vec3(1.0, 1.0, 1) })
            .start();
    }

}


